<template>
  <div class="or-main-wrapper">
    <div v-if="testId" key="query">
      <div style="margin-bottom: 0px; padding-bottom: 0px">
        <el-row :gutter="20" style="margin-bottom: 0px">
          <el-col :span="3"><div class="grid-content bg-purple"></div></el-col>
          <el-col :span="6"><div class="grid-content bg-purple"></div>压力测试编号:{{pressNo}}</el-col>
          <el-col :span="2"><div class="grid-content bg-purple"></div></el-col>
          <el-col :span="6" style="width: 300px"><div class="grid-content bg-purple"></div>压力测试时间:{{preDate}}</el-col>
          <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
        </el-row>
      </div>
<!--      <div style="text-align: center; height: 50px; margin: 0px 0px 0px 0px;padding: 0px 0px 0px 0px" >-->
<!--        单位：万元，%-->
<!--      </div>-->
    </div>
    <div v-else key="add">
        <div>
          <label>压力测试场景</label>
          <el-select
            v-model="select.preSence"
            multiple
            collapse-tags
            :placeholder="preSenceSelect"
            clearable
          >
            <el-option
              v-for="item in sceneList"
              :key="item.ssTaskid"
              :label="item.ssScenename"
              :value="item.ssTaskid"
            ></el-option>
          </el-select>
        </div>
        <div>
          <label>压力测试名称</label>
          <el-input v-model="pressName" maxlength="20" show-word-limit/>
        </div>
    </div>
    <div v-if="!testId">
      <el-button
        type="success"
        :disabled="flag"
        @click="addTestScence"
      >确定</el-button>
      <el-button
        :disabled="flag"
        @click="resetBtn"
      >取消</el-button>
    </div>
    <el-divider style="margin:0px;padding : 0px"></el-divider>
    <div>
      <div>
        <span>单位：万元，%</span>
        <el-button
          type="success"
          :disabled="flag"
          v-if="!testId"
          @click="goPress"
        >施压</el-button>
      </div>
      <div>
        <el-table
          border
          :data="tableData"
          style="width: 100%"
          :header-cell-style="{background:'fff'}"
          :span-method="arraySpanMethod"

          show-summary
        >
          <el-table-column
            v-for="(item,index) in tableClumn"
            :key="index"
            :prop="item.prop"
            :label="item.label"
            :width="item.width"
            align="center"
            :fixed="tableData.length !== 0 ? item.fixed:false"
          >
            <el-table-column
              v-for="(items,index) of item.child"
              :key="index"
              :prop="items.prop"
              :label="items.label"
              :width="items.width"
              align="center"
            >
              <el-table-column
                v-for="(childItem,index) of items.childItem"
                :key="index"
                :prop="childItem.prop"
                :label="childItem.label"
                :width="childItem.width"
                align="center"
              >
              </el-table-column>
            </el-table-column>
          </el-table-column>
        </el-table>

      </div>
    </div>
  </div>

</template>

<script>
import {stressTestResultById} from '../../api/stress'
import {initSceneList} from '../../api/stress'
import { addSceneList } from '../../api/stress'
import {initPress} from '../../api/stress'

export default {
  name: 'StressResust',
  data(){
    return{

        // testId:'',
        // name:'',
        // time: '',
      pressNo:'',
      preDate:"",
      pressName:"",
      flag:false,
      select:{
        preSence:[],
      },
      preSenceSelect:'请选择压力测试场景',
      sceneList:[],
      tableData:[],
      tableClumn:[
        {
          prop:"",
          label:"",
          width:285,
          fixed:true,
          child:[
            {
              prop:"sceneName",
              label:"场景名称",
              width:160
            },
            {
              prop:"sname",
              label:"情景名称",
              width:125
            },
          ]
        },{
          prop:"",
          label:"压力参数",
          child:[
            {
              prop:"",
              label:"影响总收入",
              childItem:[
                {
                  prop:"ssBizline",
                  label:"业务条线",
                  width:125
                },
                {
                  prop:"ssBizlinenum",
                  label:"数值",
                  width:125
                }
              ]
            }, {
              prop:"ssOthavailcaptal",
              label:"其他可用资本项目",
              width:125
            },
          ]
        },{
          prop:"",
          label:"施压前",
          width:125,
          child:[
            {
              prop:"stCapitalbefore",
              label:"可用资本",
              width:125
            },
            {
              prop:"stRatiobefore",
              label:"风险加权资产",
              width:125
            },
            {
              prop:"stOptrwabefore",
              label:"操作风险rwa",
              width:125
            },
            {
              prop:"stRwabefore",
              label:"资本充足率",
              width:125
            }
          ]
        },{
          prop:"",
          label:"施压后",
          width:125,
          child:[
            {
              prop:"srAvalprinline",
              label:"可用资本",
              width:125
            },
            {
              prop:"srSumassetline",
              label:"风险加权资产",
              width:125
            },
            {
              prop:"srOrrwaline",
              label:"操作风险rwa",
              width:125
            },
            {
              prop:"srAssetratioline",
              label:"资本充足率",
              width:125
            }
          ]
        }
      ],

    }
  },
  computed:{
    testId(){
      return this.$route.query.testId
    }
  },
  created () {
    if(this.testId){
      this.stressTestResultById1(this.testId);
    }else {
      this.getScenceList();
    }
  },
  methods:{
    stressTestResultById1(testId){
      stressTestResultById(testId).then(res => {
        console.log(res)
        this.pressName = res.data.data.stName
        this.preDate = res.data.data.stTesttime

      })
    },
    arraySpanMethod(rowIndex,columnIndex){
      if(columnIndex== 0 || columnIndex ===2) {
        if(rowIndex === 0 || rowIndex % 3 ===0 ){
          return {
            rowspan : 3,
            colspan : 1
          }
        }else{
          return {
            rowspan : 0,
            colspan : 0
          }
        }
      }
      if(columnIndex >= 5 || columnIndex <= 8) {
        if(rowIndex === 0){
          return {
            rowspan : 1000,
            colspan : 1
          }
        }else{
          return {
            rowspan : 0,
            colspan : 0
          }
        }
      }
    },
    getScenceList(){
      initSceneList().then(res => {
        console.log(res)
        if(res.data.code === 200){
          this.sceneList = res.data.data
        }
      })
    },
    addTestScence(){
      if(this.select.preSence == ""){
        this.$message.error('请选择要施压的场景')
      }else {
        this.getTestScence();
      }
    },
    getTestScence(){
      console.log(this.select.preSence)
      // let data = {
      //   taskIdList : this.select.preSence
      // }
    addSceneList(this.select.preSence).then(res => {
      console.log(res)
      if(res.data.code === 200){
        const arr = res.data.data
        if(arr != null){
          let list = [];
          for(let i = 0; i < arr.length; i++){
            list = list.concat(arr[i])
          }
          this.tableData = list
        }else{
          this.tableData = []
        }
      }
    })

    },
    resetBtn(){

    },
    goPress(){
      if(this.select.preSence == ""){
        this.$message.error('请选择要施压的场景')
      }else if(this.pressName == ""){
        this.$message.error('请填写压力测试名称')
      }else{
        let data = {
          taskIdList : this.select.preSence,
          testName: this.pressName
        };
        this.$confirm("确定发起压力测试","提示",{
          confirmButtonText:"确定",
          cancelButtonText:"取消",
          type:"warning"
        }).then(()=>{
          initPress(data).then(res=>{
            console.log(res)
            if(res.data.code === 200){
              const arr = res.data.data
              if(arr != null){
                let list = [];
                for(let i = 0; i < arr.length; i++){
                  list = list.concat(arr[i])
                }
                this.tableData = list
              }else{
                this.tableData = []
              }
            }
          })
        })
      }
    },
    getSummaries(param) {
      console.log("1111111111111111")
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '总价';
          return;
        }
        const values = data.map(item => Number(item[column.property]));
        if (!values.every(value => isNaN(value))) {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] += ' 元';
        } else {
          sums[index] = 'N/A';
        }
      });

      return sums;
    }

  }
}
</script>

<style>
.bg-purple-dark {
}
.bg-purple {
}
.bg-purple-light {
}
.grid-content {
  border-radius: 4px;
  min-height: 36px;
}
.row-bg {
  padding: 10px 0;
}
</style>
